<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>详情页面</title>
</head>
<body>

<div id="myDiv"></div>

<h2 id ="name"></h2>
<div id = "time"></div>
<div id = "text"></div>

<script>

    //JS获取url参数
    function getQueryVariable(variable)
    {
        var query = window.location.search.substring(1);
        var vars = query.split("&");
        for (var i=0;i<vars.length;i++) {
            var pair = vars[i].split("=");
            if(pair[0] == variable){return pair[1];}
        }
        return(false);
    }
    let id = getQueryVariable("id") ;

    //标准接口模式
    var xmlhttp;
    if (window.XMLHttpRequest)
    {
        //  IE7+, Firefox, Chrome, Opera, Safari 浏览器执行代码
        xmlhttp=new XMLHttpRequest();
    }
    else
    {
        // IE6, IE5 浏览器执行代码
        xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
    }
    xmlhttp.onreadystatechange=function()
    {
        if (xmlhttp.readyState==4 && xmlhttp.status==200)
        {
            //代表请求成功的数据
            document.getElementById("myDiv").innerHTML=xmlhttp.responseText;

            let res = xmlhttp.responseText;
            res = JSON.parse(res);
            console.log(res);
            document.querySelector("#name").innerHTML = res.name;
            document.querySelector("#time").innerHTML = res.time;
            document.querySelector("#text").innerHTML = res.text;


        }
    }

    xmlhttp.open("GET","http://192.168.84.130/Api_demo/Api/post.php?id="+id,true);
    xmlhttp.send();
</script>
</body>
</html>